import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:photo_view/photo_view_gallery.dart';

class ImageHero extends StatefulWidget {
  final List imageUrls;
  final String tagId;
  final int index;
  const ImageHero(
      {super.key,
      required this.imageUrls,
      required this.tagId,
      required this.index});

  @override
  State<ImageHero> createState() => _ImageHeroState();
}

class _ImageHeroState extends State<ImageHero> {
  int currentIndex = 0;
  @override
  void initState() {
    super.initState();
    setState(() {
      currentIndex = widget.index;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.black,
      body: AnnotatedRegion<SystemUiOverlayStyle>(
        value: SystemUiOverlayStyle.light,
        child: Stack(
          children: [
            Hero(
              tag: widget.tagId,
              child: PhotoViewGallery.builder(
                itemCount: widget.imageUrls.length,
                pageController: PageController(initialPage: widget.index),
                onPageChanged: (index) {
                  setState(() {
                    currentIndex = index;
                  });
                },
                builder: (context, index) {
                  return PhotoViewGalleryPageOptions(
                    imageProvider: NetworkImage(widget.imageUrls[index]),
                  );
                },
              ),
            ),
            Positioned(
              left: 0,
              right: 0,
              bottom: 15,
              child: Container(
                alignment: Alignment.center,
                child: Text(
                  "${currentIndex + 1}/${widget.imageUrls.length}",
                  style: TextStyle(color: Colors.white),
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }
}
